<!--
* @description 巡检点位详情
* @author zywu
* @date 2021/03/12 16:32:20
!-->
<template>
  <div class="inspect-point" :class="{
    'is-readonly': compile,
    'is-offline': isOffline,
    'is-unpass': unPassCount > 0,
  }">
    <van-nav-bar fixed :title="title" left-arrow @click-left="onClickLeft" />
    <div style="padding-top: 46px">
      <div class="swiper-container" v-if="taskList.length > 0">
        <div class="swiper-wrapper">
          <div class="swiper-slide polling-identifier-detail" :class="{ 'polling-identifier-active': taskId == item.id }"
            v-for="(item, index) in taskList" :key="index" @click="onSlideClick(item, index)">
            <span>{{ item.startTime.substr(0, 10) }}</span>
            <span class="ell">
              {{ item.startTime.substr(11, 5) }}｜{{
                item.lliablepersonsName
              }}巡检
            </span>
          </div>
        </div>
      </div>
      <div class="inspect-point__content">
        <div v-if="detailData.id && taskList.length == 0" class="inspect-point-imgTop">
          <img v-if="detailData.picUrl" :src="detailData.picUrl.split(',')[0]" style="width: 100%" />
          <img v-else src="../../assets/img/inspect/default-point.png" alt />
          <van-uploader v-if="!compile && !isOffline" :after-read="replaceImg">
            <span>更换图片</span>
          </van-uploader>
        </div>
        <div class="inspect-content">
          <span class="inspect-content-top">检查内容</span>
          <span v-if="showPointresult"
            :class="(showPointresult && detailData.status) ? 'inspect-content__unqualified' : 'inspect-content__qualified'">
            {{ (showPointresult && detailData.status) ? '(不合格点位未解决)' : '(不合格点位已解决)' }}</span>

          <div v-for="(item, index) in detailData.contentList" :key="index">
            <div v-if="item.checkType === 1" class="inspect-content-title">
              <p class="d-flex ai-center">
                <span class="inspect-content-title__name">{{ index + 1 }}、{{ item.name }}</span>
              </p>
              <div class="inspect-content-content">
                <div @click="changeTab(item1)" class="inspect_contents" :class="{
                  'inspect-qualified-active': item.changeIndex == isOk,
                }" v-for="(item1, isOk) in item.options" :key="isOk">
                  <span>{{ item1.option }}</span>
                  <div v-if="item.changeIndex == isOk" class="triangle-bottomright">
                    <i class="iconfont icon-duigou2"></i>
                  </div>
                </div>
              </div>
              <p style="color: #f02020; font-size: 12px" v-if="item.UpTaskResult == 2">请注意，上次巡检发现这里存在问题。</p>
            </div>

            <div class="inspect-content-title" v-if="item.checkType === 2">
              <p class="d-flex ai-center">
                <span class="inspect-content-title__name">{{ index + 1 }}、{{ item.name }}</span>
              </p>
              <div class="inspect-content-contents">
                <div @click="changeTabs(item2)" class="inspect_contents" :class="item2.isOk == 2
                  ? {
                    'inspect-qualified-false':
                      item.changeIndex_false == item2.lable,
                  }
                  : {
                    'inspect-qualified-active':
                      item.changeIndex_false == item2.lable,
                  }
                  " v-for="(item2, lable) in item.options" :key="lable">
                  <span>{{ item2.option }}</span>
                  <div v-if="item.changeIndex_false == item2.lable" class="triangle-bottomright">
                    <i class="iconfont icon-duigou2"></i>
                  </div>
                </div>
              </div>
            </div>
            <div class="inspect-content-title" v-if="item.checkType === 3">
              <p class="d-flex ai-center">
                <span class="inspect-content-title__name">{{ index + 1 }}、{{ item.name }}</span>
              </p>
              <van-cell-group>
                <van-field class="number-input" :class="{
                  'is-ok':
                    item.value &&
                    Number(item.value) >= Number(item.options[0].option) &&
                    Number(item.value) <= Number(item.options[1].option),
                  'is-notok':
                    item.value &&
                    (Number(item.value) < Number(item.options[0].option) ||
                      Number(item.value) > Number(item.options[1].option)),
                }" v-model="item.value" placeholder="请输入数值" type="number" @blur="blurfield" :readonly="compile" />
              </van-cell-group>
              <div style="margin-top: 3px; font-size: 14px; color: #999">
                正常范围是{{ item.options[0].option }}-{{
                  item.options[1].option
                }}{{ item.options[2].option }}之间
              </div>
            </div>
            <div class="inspect-content-title" v-if="item.checkType === 4">
              <p class="d-flex ai-center">
                <span class="inspect-content-title__name">{{ index + 1 }}、{{ item.name }}</span>
                <span>（不低于{{ item.options[0].option }}张，不高于9张）</span>
              </p>
              <van-uploader class="upload-image" id="upload_image"
                :accept="isOffline?'image/png, image/jpg, image/jpeg, image/gif':'image/png, image/jpg, image/jpeg, image/gif, video/*'" :after-read="(e) => {
                  afterRead(e, item);
                }
                  " @click-preview="(e) => {
    seeImgVideo(e, item);
  }
    " :before-delete="(e) => {
    beforedelete(e, item);
  }
    " v-model="item.fileList" multiple show-index="false" :max-count="9" ref="srcImage"
                :min-count="item.options[0].option" :preview-full-image="false"></van-uploader>
            </div>
          </div>
          <!-- 现场是否已经解决问题 -->
          <div class="inspect-content-title"
            v-if="!compile && (resolved_question_one || resolved_question_two || resolved_question_thr)">
            <p class="d-flex ai-center">
              <span class="inspect-content-title__name">{{ detailData.contentList ? (detailData.contentList.length + 1) :
                ''
              }}、现场是否已经解决问题</span>
            </p>
            <div class="inspect-content-contents">
              <div @click="resolved_question_value = 1" class="inspect_contents"
                :class="resolved_question_value == 1 ? 'inspect-qualified-active' : ''">
                <span>是</span>
                <div v-if="resolved_question_value == 1" class="triangle-bottomright">
                  <i class="iconfont icon-duigou2"></i>
                </div>
              </div>
              <div @click="resolved_question_value = 2" class="inspect_contents"
                :class="resolved_question_value == 2 ? 'inspect-qualified-false' : ''">
                <span>否</span>
                <div v-if="resolved_question_value == 2" class="triangle-bottomright">
                  <i class="iconfont icon-duigou2"></i>
                </div>
              </div>
            </div>
          </div>
          <!-- 查看隐患整改单 -->
          <div class="inspect-updata" style="margin-top: 20px;" v-if="showPointresult && detailData.status">
            <van-button @click="jumpTrouble" type="primary" size="large" color="#2471CA">查看隐患整改单</van-button>
          </div>
          <div class="inspect-updata" v-if="!compile">
            <van-checkbox v-if="!isOffline && resolved_question_value == 2" class="pretermit" checked-color="#2471CA"
              v-model="checked" shape="square" icon-size="16px">默认结果为不合格且现场未解决问题时，同时创建隐患整改单</van-checkbox>
            <van-button @click="handleSubmit" :disabled="loading" type="primary" size="large"
              color="#2471CA">提交</van-button>
          </div>
        </div>
      </div>
      <!-- 查看视频 -->
      <van-popup class="show-video" v-model="showVideo" position="bottom" :style="{ height: '100%' }"
        @click-close-icon="closeVideo" close-icon-position="top-left" closeable close-icon="arrow-left"
        @opened="openVideo">
        <div v-if="compile" class="show-video-detail">
          <swiper :options="swiperOption" v-if="stopVideo">
            <swiper-slide class="swiper-slide" v-for="(item, i) in imgVideoList" :key="i">
              <video :src="item.isVideo"
                v-if="item.isVideo.substring(item.isVideo.length - 3) == 'mp4' || item.isVideo.substring(item.isVideo.length - 3) == '3gp' || item.isVideo.substring(item.isVideo.length - 4) == 'mpeg' || item.isVideo.substring(item.isVideo.length - 6) == 'mavip4' || item.isVideo.substring(item.isVideo.length - 3) == 'flv' || item.isVideo.substring(item.isVideo.length - 3) == 'MOV' || item.isVideo.substring(item.isVideo.length - 3) == 'mov'"
                controls="controls" class="video-controls"></video>
              <img :src="item.isVideo" alt v-else />
            </swiper-slide>
          </swiper>
        </div>
        <div v-else>
          <swiper :options="swiperOption" v-if="stopVideo">
            <swiper-slide class="swiper-slide" v-for="(item, i) in imgVideoList" :key="i">
              <video :src="item"
                v-if="item.substring(item.length - 3) == 'mp4' || item.substring(item.length - 3) == '3gp' || item.substring(item.length - 4) == 'mpeg' || item.substring(item.length - 6) == 'mavip4' || item.substring(item.length - 3) == 'flv' || item.substring(item.length - 3) == 'MOV' || item.substring(item.length - 3) == 'mov'"
                controls="controls" class="video-controls"></video>
              <img :src="item" alt v-else />
            </swiper-slide>
          </swiper>
        </div>
      </van-popup>
    </div>
  </div>
</template>

<script>
import {
  getExaminePointContentList,
  commitPointResult,
  getTaskPointResult,
  updatePointPic,
  getExamineTaskListByIds,
} from '@/api/inspect'
import { qiniuUpload } from '@/utils/util'
import { mapState } from 'vuex'
import Swiper from 'swiper'
import '@/styles/swiper.css'
import { Toast, Dialog } from 'vant'
let mySwiper = ''
let fbsId = ''
let fbsName = ''
let address = ''
export default {
  data() {
    return {
      loading: false,
      showPointresult: false, //当前点位是否合格 用来显示跳转隐患按钮
      resolved_question_one: false,
      resolved_question_two: false,
      resolved_question_thr: false,
      resolved_question_value: '', //1:解决  2：：未解决
      value: '',
      checked: true,
      taskList: [],
      upqiniu: 'http://upload.qiniup.com',
      detailData: {},
      compile: false,
      createHiddenDanger: false,
      taskId: '',
      unPassCount: 0,
      showVideo: false, // 查看视频
      srcVideo: '', // 视频
      stopVideo: false, // 是否显示视频控件
      videoList: require('../../assets/img/common/video-detail.png'), // 视频默认图片
      imgVideoList: [], // 图片和视频组合
      swipper: 0,
      stopVideos: false,
      swiperOption: {
        // 所有的参数同 swiper 官方 api 参数
        // 这里面的配置，官网上是怎样的，直接复制过来用即可，`https://www.swiper.com.cn/api/index.html`
        initialSlide: 0,
        on: {
          slideChangeTransitionStart: function () {
            // 左右滑动暂停视频播放
            let item = document.getElementsByClassName("video-controls");
            for (
              let i = 0;
              i < document.getElementsByClassName("video-controls").length;
              i++
            ) {
              document.getElementsByClassName("video-controls")[i].pause();
            }
          },
        },
      },
      videoArr: []
    };
  },
  watch: {
    swipper(newval) {
      this.swiperOption.initialSlide = newval
    },
  },
  components: {},
  computed: {
    ...mapState(['userInfo', 'appKeyObj', 'qiniuPath', 'isOffline']),
    title() {
      return this.taskIds ? this.unPassCount + '次不合格' : this.detailData.name
    },
  },
  created() {
    // console.log('created__created')
    let { compile, pointId, taskId, getPointresult } = this.$route.query
    this.showPointresult = getPointresult
    // 从不合格点位跳转的
    let { examinedTaskIds, unPassCount, id } = this.$route.params
    if (examinedTaskIds) {
      this.compile = true
      this.pointId = id
      this.taskIds = examinedTaskIds
      this.unPassCount = unPassCount
      this.getExamineTaskListByIds(examinedTaskIds.join(','))
    } else {
      this.compile = !compile
      this.pointId = pointId
      this.taskId = taskId
      if (compile) {
        // 编辑
        this.getDetail()
      } else {
        // 查看详情
        this.getCompile()
      }
    }
  },

  mounted() { },

  methods: {
    blurfield() {
      this.resolved_question_thr = !!this.detailData.contentList.find(n => {
        let val = n.value
        return n.checkType == 3 && val && (Number(val) < Number(n.options[0].option) || Number(val) > Number(n.options[1].option))
      })
    },
    // 查看隐患整改单： 5：待指派goAppoint.html   1：整改goRectification.html    3：核实goVerify.html   2：完成finishMsg.html
    jumpTrouble() {
      //待指派
      if (this.detailData.status == 5) {
        window.top.app.router.navigate("/goAppoint/" + this.detailData.dangerId + "/");
      }
      //待整改
      else if (this.detailData.status == 1) {
        window.top.app.router.navigate("/goRectification/" + this.detailData.dangerId + "/");
      }
      //待核实
      else if (this.detailData.status == 3) {
        window.top.app.router.navigate("/goVerify/" + this.detailData.dangerId + "/");
      }
      //已完成
      else {
        window.top.app.router.navigate("/finishMsg/" + this.detailData.dangerId + "/");
      }
    },
    getExamineTaskListByIds(taskIds) {
      getExamineTaskListByIds({ taskIds }).then((res) => {
        this.taskId = res.data[0].id
        this.taskList = res.data
        this.$nextTick(() => {
          this.initSwiper()
        })
        this.getCompile()
      })
    },
    initSwiper() {
      mySwiper = new Swiper('.swiper-container', {
        direction: 'horizontal',
        loop: false,
        freeMode: true,
        width: 160,
        spaceBetween: 8,
        centeredSlides: true,
        slidesPerView: 1,
      })
    },
    onSlideClick(item, index) {
      this.taskId = item.id
      mySwiper.slideTo(index)
      this.getCompile()
    },
    handleSubmit() {
      if (this.isOffline && (this.resolved_question_thr || this.resolved_question_two || this.resolved_question_one)) {
        Dialog.confirm({
          title: '提示',
          message:
            '当前点位有不合格项，确定提交吗？',
        })
          .then(() => {
            this.updataResult()
          })
          .catch(() => {
          });
      } else {
        this.updataResult()
      }
    },
    // 提交
    updataResult() {
      let pointContentArr = []
      let _this = this
      let isPass = true
      let description = []
      for (let i = 0; i < _this.detailData.contentList.length; i++) {
        let item = {}
        let contentObj = _this.detailData.contentList[i]
        let contentName = contentObj.name
        if (contentObj.checkType == 1) {
          item = {
            taskId: _this.$route.query.taskId,
            pointId: _this.detailData.id,
            contentResult: contentObj.lable
              ? contentObj.lable
              : contentObj.options[0].lable,
            result: contentObj.result
              ? contentObj.result
              : contentObj.options[0].isOk,
            contentId: contentObj.id,
          }
          if (item.result == 2) {
            description.push(contentName + '：不合格')
          }
        } else if (contentObj.checkType == 2) {
          item = {
            taskId: _this.$route.query.taskId,
            pointId: _this.detailData.id,
            contentResult: contentObj.lable
              ? contentObj.lable
              : contentObj.options[0].lable,
            result: contentObj.result
              ? contentObj.result
              : contentObj.options[0].isOk,
            contentId: contentObj.id,
          }
          if (item.result == 2) {
            description.push(
              `${contentName}：${(
                contentObj.options.filter((n) => {
                  return n.lable == item.contentResult
                })[0] || {}
              ).option
              }`
            )
          }
        } else if (contentObj.checkType == 3) {
          let value = contentObj.value
          if (!value) {
            isPass = false
            Toast(`请输入${contentName}检查结果`)
            return false
          }
          item = {
            taskId: _this.$route.query.taskId,
            pointId: _this.detailData.id,
            contentResult: value,
            result:
              Number(value) >= Number(contentObj.options[0].option) &&
                Number(value) <= Number(contentObj.options[1].option)
                ? 1
                : 2,
            contentId: contentObj.id,
          }
          if (item.result == 2) {
            description.push(
              contentName + '：' + value + contentObj.options[2].option
            )
          }
        } else if (contentObj.checkType == 4) {
          let minPic = contentObj.options[0].option
          // console.log('contentObj.fileLists',contentObj.fileLists)
          if (contentObj.fileLists.length < Number(minPic)) {
            isPass = false;
            Toast(`${contentName}至少上传${minPic}张照片${this.isOffline?'':'或视频'}`);
            return false;
          }
          item = {
            taskId: _this.$route.query.taskId,
            pointId: _this.detailData.id,
            contentResult: contentObj.fileLists.join(
              this.isOffline ? '___' : ','
            ),
            result: 1,
            contentId: contentObj.id,
          }
        }
        pointContentArr.push(item)
      }
      if (!isPass) return
      var isresolveValue = (this.resolved_question_thr || this.resolved_question_two || this.resolved_question_one) ? this.resolved_question_value : ''
      console.log('this.resolved_question_one-this.resolved_question_two', this.resolved_question_one, this.resolved_question_two)
      if (this.resolved_question_one || this.resolved_question_two || this.resolved_question_thr) {
        if (this.resolved_question_value == '') {
          Toast(`请选择现场是否已解决问题`)
          return
        }
      }
      let param = {
        taskId: _this.$route.query.taskId.toString(),
        pointId: _this.detailData.id.toString(),
        pointCode: _this.$route.query.pointCode,
        examinePointAccount: _this.userInfo.accountName,
        pointContentResultsSting: JSON.stringify(pointContentArr),
        isResolveProblem: isresolveValue
      }
      if (this.isOffline) {
        param.addTime = this.$moment().format('yyyy-MM-DD HH:mm:ss')
      }

      // if (window.testListData) {
      //   param = {
      //     dataListStr: JSON.stringify(window.testListData.map(n => {
      //       let res = JSON.parse("[{\"taskId\":234,\"pointId\":17,\"contentResult\":\"1\",\"result\":2,\"contentId\":98},{\"taskId\":234,\"pointId\":17,\"contentResult\":\"1\",\"result\":2,\"contentId\":99},{\"taskId\":234,\"pointId\":17,\"contentResult\":\"A\",\"result\":1,\"contentId\":100},{\"taskId\":234,\"pointId\":17,\"contentResult\":\"A\",\"result\":1,\"contentId\":101},{\"taskId\":234,\"pointId\":17,\"contentResult\":\"A\",\"result\":1,\"contentId\":102},{\"taskId\":234,\"pointId\":17,\"contentResult\":\"21\",\"result\":2,\"contentId\":103},{\"taskId\":234,\"pointId\":17,\"contentResult\":\"A\",\"result\":1,\"contentId\":104},{\"taskId\":234,\"pointId\":17,\"contentResult\":\"A\",\"result\":1,\"contentId\":105},{\"taskId\":234,\"pointId\":17,\"contentResult\":\"A\",\"result\":1,\"contentId\":106},{\"taskId\":234,\"pointId\":17,\"contentResult\":\"A\",\"result\":1,\"contentId\":107},{\"taskId\":234,\"pointId\":17,\"contentResult\":\"1\",\"result\":1,\"contentId\":108}]")
      //       res.forEach(m => {
      //         m.pointId = n.id
      //       })
      //       return {
      //         "taskId": param.taskId,
      //         "pointId": n.id,
      //         "pointCode": n.pointCode,
      //         "examinePointAccount": "lgAdmin",
      //         "pointContentResultsSting": JSON.stringify(res),
      //         "isResolveProblem": 1,
      //       }
      //     }))
      //   }
      // }
      // console.log(JSON.stringify(param))
      this.loading = true
      commitPointResult(param).then((res) => {
        if (res.status == 200) {
          Toast(`提交成功`)
          window.inspect_point_result = {
            pointCode: _this.$route.query.pointCode,
            result: (this.resolved_question_thr || this.resolved_question_two || this.resolved_question_one) ? 2 : 1
          }
          // 跳转隐患创建
          if (!this.isOffline && this.checked && description.length > 0) {
            // 不能含有“/”
            let desc = `${description.join(
              '。'
            )},${fbsName},${fbsId},${address}`.replace(/\//g, '$')
            if (isresolveValue == 2) {
              // console.log('不合格跳转整改')
            } else {
              // console.log('合格直接返回')
              this.$router.go(-1)
              return
            }
            window.top.app.router.navigate(`/createTrouble/${desc}/${_this.$route.query.taskId.toString()}/${_this.detailData.id.toString()}/`, {
              reloadCurrent: this.$route.query.tabId == '3',
            })
          } else {
            _this.onClickLeft()
          }
          _this.$store.commit('isRenovateChange', true)
          this.loading = false
        } else {
          this.loading = false
          Toast(res.info)
        }
      })
    },
    // 点位巡检内容（扫一扫）
    getDetail() {
      let _this = this
      getExaminePointContentList({
        pointCode: _this.$route.query.pointCode,
      }).then((res) => {
        for (let i = 0; i < res.data.contentList.length; i++) {
          if (res.data.contentList[i].checkType == 1) {
            _this.$set(res.data.contentList[i], "changeIndex", 0);
            if (res.data.contentList[i].options[0].isOk == 2) {
              _this.resolved_question_two = true
            } else {
              _this.resolved_question_two = false
            }
          } else if (res.data.contentList[i].checkType == 2) {
            _this.$set(
              res.data.contentList[i],
              "changeIndex_false",
              res.data.contentList[i].options[0].lable
            );
            if (res.data.contentList[i].options[0].isOk == 2) {
              _this.resolved_question_two = true
            } else {
              _this.resolved_question_two = false
            }
          } else if (res.data.contentList[i].checkType == 3) {
            _this.$set(res.data.contentList[i], "value", "");
          } else if (res.data.contentList[i].checkType == 4) {
            _this.$set(res.data.contentList[i], "fileList", []);
            _this.$set(res.data.contentList[i], "fileLists", []);
          }
        }
        _this.detailData = res.data;
        fbsId = res.data.fbsId;
        fbsName = res.data.fbsName || "";
        address = res.data.address;
      });
    },
    // 查看详情
    getCompile() {
      let _this = this
      getTaskPointResult({
        taskId: _this.taskId.toString(),
        pointId: _this.pointId.toString(),
      }).then((res) => {
        _this.detailData = res.data
        for (let i = 0; i < this.detailData.contentList.length; i++) {
          let contentObj = this.detailData.contentList[i]
          if (contentObj.checkType == 1) {
            let index = 0
            contentObj.options.forEach((n, ni) => {
              if (n.lable == contentObj.contentResult) {
                index = ni
              }
            })
            _this.$set(contentObj, 'changeIndex', index)
          } else if (contentObj.checkType == 2) {
            _this.$set(
              contentObj,
              'changeIndex_false',
              contentObj.contentResult
            )
          } else if (contentObj.checkType == 3) {
            _this.$set(contentObj, 'value', contentObj.contentResult)
          } else if (contentObj.checkType == 4) {
            if (this.isOffline) {
              _this.$set(
                contentObj,
                'fileList',
                contentObj.contentResult.split('___').map((n) => {
                  if (n.indexOf('data:image') > -1) {
                    return {
                      content: n,
                    }
                  } else {
                    return {
                      url: n,
                      isImage: true,
                      isVideo: n,
                    }
                  }
                })
              )
            } else {
              _this.$set(
                contentObj,
                'fileList',
                contentObj.contentResult.split(',').map((n) => {
                  return {
                    url: n,
                    isImage: true,
                    isVideo: n,
                  }
                })
              )
            }
          }
        }
        for (let i in _this.detailData.contentList) {
          let item = _this.detailData.contentList[i]
          if (item.checkType == 4) {
            for (let j in item.fileList) {
              if (!_this.checkVideo(item.fileList[j].url)) {
                item.fileList[j].url = _this.videoList
              }
            }
          }
        }
        console.log(_this.detailData);
      });
    },
    // 查看是否为视频
    checkVideo(item) {
      if(!item) return false
      if (
        item.substring(item.length - 3) === "mp4" ||
        item.substring(item.length - 3) === "3gp" ||
        item.substring(item.length - 4) === "mpeg" ||
        item.substring(item.length - 6) === "mavip4" ||
        item.substring(item.length - 3) === "flv" ||
        item.substring(item.length - 3) === "MOV" ||
        item.substring(item.length - 3) === "mov"
      ) {
        return false
      } else {
        return true
      }
    },
    // 选项1
    changeTab(item) {
      let _this = this
      if (!_this.compile) {
        for (let i = 0; i < _this.detailData.contentList.length; i++) {
          if (item.contentId == _this.detailData.contentList[i].id) {
            _this.$set(_this.detailData.contentList[i], 'result', item.isOk)
            _this.$set(_this.detailData.contentList[i], 'lable', item.lable)
            _this.detailData.contentList[i].changeIndex = item.isOk - 1
          }
        }
        if (item.isOk == 2) {
          _this.resolved_question_one = true
        } else {
          _this.resolved_question_one = false
        }
        if (!_this.resolved_question_two) {
          for (let i = 0; i < _this.detailData.contentList.length; i++) {
            if (_this.detailData.contentList[i].result && _this.detailData.contentList[i].result == 2) {
              _this.resolved_question_one = true
            } else {

            }
          }
        }

        console.log('_this.resolved_question_one===:', _this.resolved_question_one)
      }
    },
    // 选项2
    changeTabs(item) {
      let _this = this
      if (!_this.compile) {
        for (let i = 0; i < _this.detailData.contentList.length; i++) {
          if (item.contentId == _this.detailData.contentList[i].id) {
            _this.$set(_this.detailData.contentList[i], 'result', item.isOk)
            _this.$set(_this.detailData.contentList[i], 'lable', item.lable)
            _this.detailData.contentList[i].changeIndex_false = item.lable
          }
        }
        if (item.isOk == 2) {
          _this.resolved_question_two = true
        } else {
          _this.resolved_question_two = false
        }
        if (!_this.resolved_question_one) {
          for (let i = 0; i < _this.detailData.contentList.length; i++) {
            if (_this.detailData.contentList[i].result && _this.detailData.contentList[i].result == 2) {
              _this.resolved_question_two = true
            } else {

            }
          }
        }
        console.log('_this.resolved_question_two===:', _this.resolved_question_two)
      }
    },
    // 更换顶部图片
    replaceImg({ file }) {
      let _this = this
      // 此时可以自行将文件上传至服务器
      qiniuUpload(file, {
        next: (res) => {
          // ...
        },
        error: (err) => {
          // ...
        },
        complete: (res) => {
          _this.detailData.picUrl = uploadOnNginx ? res.data : this.qiniuPath + res.key
          updatePointPic({
            id: _this.detailData.id, // 点位id
            pic: _this.detailData.picUrl,
          }).then((res) => { })
        },
      })
    },
    // 上传图片
    afterRead(res, item) {
      let arr = res.file ? [res] : res;
      if (this.isOffline) {
        arr.forEach((n) => {
          for (let i = 0; i < this.detailData.contentList.length; i++) {
            if (item.id === this.detailData.contentList[i].id) {
              // base64
              this.detailData.contentList[i].fileLists.push(n.content)
            }
          }
        })
        return
      }
      // 此时可以自行将文件上传至服务器
      arr.forEach((n) => {
        this.requestUpload(n.file, item)
      })
    },
    // 播放视频
    seeImgVideo(res, item) {
      // 详情预览
      if (res.isVideo) {
        this.imgVideoList = item.fileList
        for (let i in this.imgVideoList) {
          if (this.imgVideoList[i].isVideo == res.isVideo) {
            this.swipper = i
          }
        }
        this.showVideo = true
      } else if (res.file) {
        // 上传预览
        for (let i in item.fileList) {
          if (res.content === item.fileList[i].content) {
            this.srcVideo = item.fileLists[i]
            this.imgVideoList = item.fileLists
            this.swipper = i
            this.showVideo = true
          }
        }
      }
    },
    openVideo() {
      this.stopVideo = true
    },
    // 关闭视频
    closeVideo() {
      let that = this
      that.$refs.srcImage[0].closeImagePreview()
      this.stopVideo = false
    },
    requestUpload(file, item) {
      qiniuUpload(file, {
        next: (res) => {
          // ...
        },
        error: (err) => {
          // ...
        },
        complete: (res) => {
          for (let i = 0; i < this.detailData.contentList.length; i++) {
            if (item.id === this.detailData.contentList[i].id) {
              this.detailData.contentList[i].fileLists.push(
                uploadOnNginx ? res.data : this.qiniuPath + res.key
              )
              console.log('this.detailData.contentList[i].fileLists', this.detailData.contentList[i].fileLists)
            }
          }
        },
      })
    },
    // 删除照片
    beforedelete({ file }, item) {
      let _this = this
      for (let j = 0; j < _this.detailData.contentList.length; j++) {
        if (item.id === _this.detailData.contentList[j].id) {
          for (let i = 0; i < item.fileList.length; i++) {
            if (file.lastModified === item.fileList[i].file.lastModified) {
              _this.detailData.contentList[j].fileList.splice(i, 1)
              _this.detailData.contentList[j].fileLists.splice(i, 1)
            }
          }
        }
      }
    },
    onClickLeft() {
      if (this.$route.query.tabId == '3') {
        window.top.app.methods.backToTab()
      } else {
        this.$router.go(-1)
      }
    },
  },
}
</script>
<style lang='scss'>
.inspect-point {
  &.is-readonly {

    .van-uploader__upload,
    .van-uploader__preview-delete {
      display: none;
    }
  }

  &.is-offline {
    .inspect-updata {
      padding-top: 20px;
    }
  }

  &.is-unpass {
    .inspect-content {
      padding-top: 0;
    }
  }

  .show-video {
    background: #000;

    .swiper-container {
      padding: 0%;
      margin: auto 0;

      .swiper-slide {
        height: 100vh;
        display: flex;
        align-items: center;
        justify-content: center;

        img,
        video {
          width: 100vw;
        }
      }
    }
  }

  .tag-order {
    margin-right: 5px;
    width: 26px;
    height: 26px;
    background: #1778e7;
    color: #fff !important;
    border-radius: 13px;
    line-height: 26px;
  }

  .swiper-container {
    padding: 16px 14px;
  }

  &__content {
    padding: 10px 14px;
  }

  .inspect-point-imgTop {
    position: relative;

    img {
      width: 100%;
    }

    .van-uploader {
      position: absolute;
      bottom: 20px;
      right: 14px;
      font-size: 14px;
      color: #fff;
      padding: 6px 16px;
      border-radius: 16px;
      background: #2979d1;
    }
  }

  .polling-identifier-detail {
    width: 140px;
    padding: 20px 16px;
    box-shadow: 0px 2px 10px 2px rgba(181, 200, 206, 0.5);
    border-radius: 6px;
    display: inline-block;
  }

  .swiper-slide {
    display: inline-flex;
    flex-direction: column;

    span:nth-child(1) {
      font-size: 17px;
      font-weight: 600;
      color: #2471ca;
    }

    span:nth-child(2) {
      margin-top: 2px;
      color: #333333;
      font-size: 14px;
    }
  }

  .polling-identifier-active {
    background: linear-gradient(#3592ff 0%, #1778e7 100%);

    span:nth-child(1) {
      color: #fff;
    }

    span:nth-child(2) {
      color: #fff;
    }
  }

  .inspect-content {
    padding-top: 10px;

    .inspect-content-top {
      font-size: 18px;
      font-weight: bold;
      margin-right: 20px;
    }

    &__qualified {
      font-size: 16px;
      color: rgb(48, 175, 31);
      ;
    }

    &__unqualified {
      font-size: 16px;
      color: rgb(255, 0, 0);
      ;
    }

    .inspect-updata {
      .pretermit {
        margin: 10px 0;

        span {
          font-size: 14px;
          color: #999999;
        }
      }
    }

    .inspect-content-title {
      margin-bottom: 15px;

      &__name {
        // flex: 1;
        word-break: break-all;
      }

      p {
        font-size: 14px;

        span {
          font-size: 14px;
          color: #999999;
        }
      }

      .number-input {
        border: 1px solid #d0d0d0;
        border-radius: 5px;
        padding: 6px 12px;

        &.is-ok {
          .van-field__control {
            color: rgba(105, 186, 113, 1);
          }
        }

        &.is-notok {
          .van-field__control {
            color: rgba(240, 32, 32, 1);
          }
        }
      }

      .inspect-content-content {
        display: flex;

        .inspect_contents {
          padding: 10px 20px;
          border: 1px solid #d0d0d0;
          font-size: 14px;
          border-radius: 5px;
          color: #333333;
        }

        .inspect_contents:nth-child(2),
        .inspect-qualified-active:nth-child(2) {
          margin-left: 16px;
        }

        .inspect-qualified-active:nth-child(1) {
          border: 1px solid #69ba71;
          font-size: 14px;
          border-radius: 5px;
          color: #333333;
          padding: 10px 20px;
          color: #69ba71;
          position: relative;
          overflow: hidden;

          .triangle-bottomright {
            width: 0;
            height: 0;
            border-bottom: 16px solid #69ba71;
            border-left: 24px solid transparent;
            position: absolute;
            bottom: 0;
            right: 0;

            .iconfont {
              position: absolute;
              right: 0;
              right: 2px;
              color: #fff;
              font-size: 12px;
              top: 4px;
            }
          }
        }

        .inspect-qualified-active:nth-child(2) {
          border: 1px solid #f02020;
          font-size: 14px;
          border-radius: 5px;
          color: #333333;
          padding: 10px 20px;
          color: #f02020;
          position: relative;
          overflow: hidden;

          .triangle-bottomright {
            width: 0;
            height: 0;
            border-bottom: 16px solid #f02020;
            border-left: 24px solid transparent;
            position: absolute;
            bottom: 0;
            right: 0;

            .iconfont {
              position: absolute;
              right: 0;
              right: 2px;
              color: #fff;
              font-size: 12px;
              top: 4px;
            }
          }
        }
      }

      .inspect-content-contents {
        display: flex;
        // justify-content: space-between;
        flex-wrap: wrap;
        width: 100%;

        .inspect_contents {
          padding: 10px 20px;
          border: 1px solid #d0d0d0;
          font-size: 14px;
          border-radius: 5px;
          color: #333333;
          margin-bottom: 10px;
          margin-right: 16px;
        }

        // .inspect_contents:nth-child(2),.inspect-qualified-active:nth-child(2){
        //   margin-left: 16px;
        // }
        .inspect-qualified-active {
          border: 1px solid #69ba71;
          font-size: 14px;
          border-radius: 5px;
          color: #333333;
          padding: 10px 20px;
          color: #69ba71;
          position: relative;
          overflow: hidden;

          .triangle-bottomright {
            width: 0;
            height: 0;
            border-bottom: 16px solid #69ba71;
            border-left: 24px solid transparent;
            position: absolute;
            bottom: 0;
            right: 0;

            .iconfont {
              position: absolute;
              right: 0;
              right: 2px;
              color: #fff;
              font-size: 12px;
              top: 4px;
            }
          }
        }

        .inspect-qualified-false {
          border: 1px solid #f02020;
          font-size: 14px;
          border-radius: 5px;
          color: #333333;
          padding: 10px 20px;
          color: #f02020;
          position: relative;
          overflow: hidden;

          .triangle-bottomright {
            width: 0;
            height: 0;
            border-bottom: 16px solid #f02020;
            border-left: 24px solid transparent;
            position: absolute;
            bottom: 0;
            right: 0;

            .iconfont {
              position: absolute;
              right: 0;
              right: 2px;
              color: #fff;
              font-size: 12px;
              top: 4px;
            }
          }
        }
      }
    }
  }

  .van-action-sheet__header {
    border-bottom: 1px solid #e1e1e1;
    font-weight: bold;
    font-size: 17px;
    padding: 23px 0;
    line-height: normal;
  }

  .content {
    .draw-top {
      margin: 17px 10px 61px 10px;
      background: rgba($color: #e1e1e1, $alpha: 0.2);
      border-radius: 5px;

      .swiper-container {
        padding: 16px 0px;
        margin: 0 14px;
      }

      .img-style {
        border: 1px solid #e1e1e1;
        width: 95px !important;
        margin-right: 6px;
      }
    }

    .draw_button {
      width: 100%;
      display: flex;
      position: fixed;
      bottom: 0px;

      button {
        width: 50%;
      }

      .draw_button_left {
        border-top: 1px solid #e1e1e1;
        width: 50%;
        text-align: center;
      }

      .draw_button_right {
        width: 50%;
        display: block;
        background: #2471ca;
        color: #fff;
        text-align: center;
      }
    }
  }

  .swiper-containers {
    width: 100vw;
    height: 100vh;

    .swiper-pagination {
      display: flex;
      align-items: center;
      justify-items: center;
    }
  }
}
</style>